import React, { useEffect, useState } from 'react';
import { Col } from 'antd';
import { AxInput, AxLabel, AxPlaceHolder, AxSelectEnum } from '@/components/AxForm/AxFormItem';
import { axhttp } from '@/shared/axhttp';
import { axhelper } from '@/shared/axhelper';

/** 修改在校
 * @param form 表单
 * @param url 请求地址
 * @param setDescription 设置内容的方法
 * @param studentStatusId 学生在校Id
 */
export const EduStatus = ({ form, url, setDescription, studentStatusId }: any) => {
    const [oldData, setOldData] = useState<any>({});
    const { getX } = axhttp;

    useEffect(() => {
        studentStatusId && getX(url.readStudentInfo, { studentId: studentStatusId }).then((res: any) => {
            setOldData(res.data);
        });
    }, [studentStatusId]);

    const handleChange = (eduStatus: any) => {
        handleChangeInfo({ eduStatus });
    }

    /** 变更信息 */
    const handleChangeInfo = (obj: any) => {
        const eduStatus = obj.hasOwnProperty('eduStatus')
            ? obj.eduStatus
            : form.getFieldValue('eduStatus');

        let changeInfo = '';
        if (eduStatus && eduStatus !== oldData.eduStatus) {
            const d = axhelper.getDicByEnumName('eduStatus');
            changeInfo += `原在校状态：${axhelper.getTextByValue(oldData.eduStatus, d)}，`;
            changeInfo += `新在校状态：${axhelper.getTextByValue(eduStatus, d)}；`;
        }
        setDescription(changeInfo);
    }

    return (
        <>
            <Col span={8}>
                <AxLabel label="姓名" value={oldData.name} />
            </Col>
            <Col span={8}>
                <AxLabel label="身份证" value={oldData.idcard} />
            </Col>
            <Col span={8}>
                <AxPlaceHolder />
            </Col>
            <Col span={8}>
                <AxSelectEnum enumName='eduStatus' form={form} label="在校状态" field="eduStatus"
                    value={oldData.eduStatus} autoSelect onChange={handleChange} required />
            </Col>
            <Col span={8}>
                <AxPlaceHolder />
            </Col>
            <Col span={8}>
                <div style={{ display: 'none' }}>
                    <AxInput form={form} field='name' value={oldData.name} />
                    <AxInput form={form} field='idcard' value={oldData.idcard} />
                </div>
            </Col>
        </>
    )
};